<template>
	<!-- orderSub/pages/order/order.wxml -->
	<view :style="objColor">
		<customer></customer>
		<view class="order-header">
			<view class="search">
				<view style="width: 85%">
					<!-- 搜索框 -->
					<view class="weui-search-bar">
						<view class="weui-search-bar__form">
							<!-- 点击之后，跳转搜索页面 -->
							<view class="weui-search-bar__box">
								<icon class="weui-icon-search_in-box" type="search" size="16"></icon>
								<input type="text" class="weui-search-bar__input" placeholder="输入站点名称/桩号搜索" @tap="goSearch" />
							</view>
						</view>
					</view>
				</view>
				<view>
					<image src="https://oos-cn.ctyunapi.cn/front-end/static/cartoon/screen.png" class="screening"
						@tap="screening"></image>
				</view>
			</view>
			<!-- 选项卡 -->
			<view class="tabs">
				<tabs :tabMenu="tabMenu" @checkIndex="checkIndex" :max-minute="maxMinute" :background="tabsBg"
					:navIndex="orderTypeIndex" class="tabs"></tabs>
			</view>
		</view>


		<!-- 订单列表 -->
		<view class="order-list">


			<view class="ToBeSettled" v-if="orderTypeIndex==2 && sellerNo!='hyc'" @tap="getOrderDescription">
				待结算状态的订单是什么？
				<image class="settlementImg" src="https://oos-cn.ctyunapi.cn/front-end/static/cartoon/back.png"></image>
			</view>
			<view class="ToBeSettled" v-if="orderTypeIndex==0" @tap="toPlaceholderOrder">
				超时占位订单（{{placeholderOrderCount}}）
				<image class="settlementImg" src="https://oos-cn.ctyunapi.cn/front-end/static/cartoon/back.png"></image>
			</view>

			<template v-if="advertisingSwitch">
				<adModule :adIdList="adIdList"/>
			</template>

			<view style="margin: 24rpx 0;">
				<view class="order-list-item" @tap="goDetails" :data-index="item" v-for="(item, index) in orderList"
					:key="index">
					<view class="order-list-top">
						<view class="siteName" @tap.stop.prevent="goSite" :data-index="item">
							{{ item.stationName ? item.stationName : '--' }}
						</view>
						<!-- :style="'color:' + (objColor2.textColor)" -->
						<!--<view class="status" :style="'color:' + (item.type == 1 ? blue : item.type == 2 ? orange : item.type == 3 ? green : gray)">-->
						<view class="status"
							:style="'color:' + (item.type == 1 ? '#6DB12E' : item.type == 2 ? '#FC724C' : item.type == 3 ? '#606266' : item.type == 5 ?'#4096EC' : '#909399')">
							{{ item.type == 1 ? '充电中' : item.type == 2 ? '待支付' : item.type == 3 ? '已完成' : item.type == 5 ?'账单结算中' : '已关闭' }}
							<uni-icons class="right-icon" type="right" size="18" :color="objColor2.textColor"></uni-icons>
							<!-- <image class="settlementImg2"
								:src="sellerNo=='jw'?'https://oos-cn.ctyunapi.cn/front-end/static/mine/images/turn-blue.png':'https://oos-cn.ctyunapi.cn/front-end/static/cartoon/turn_act.png'">
							</image> -->
						</view>
					</view>

					<view class="order-list-center">
						<view class="order-list-center-left">
							<!-- <image :src="item.stationIcon ? item.stationIcon : 'https://oos-cn.ctyunapi.cn/front-end/static/orderSub/images/pic.png'" class="order-img"></image> -->
							<view>
								<!-- <view class="gun-number">{{ item.pileName ? item.pileName : '--' }}{{ item.gunName ? '-' + item.gunName : '' }}</view> -->

								<view class="period-time">
									{{ item.startTime }}
									~ <text>{{ item.endTime ?  item.endTime : '--------' }}</text>
								</view>
								<view class="period-time2">
									订单编号： <text class="period-text">{{ item.busShowNo }}</text>
								</view>
								<view class="degree">
									<text>￥</text>
									<text>{{ item.type == 1 || item.type == 5 ? '--.--' : item.actualBalanceCalculate }}</text>
								</view>
							</view>
						</view>
						<!-- <image
                                :src="item.isSuper ? 'https://oos-cn.ctyunapi.cn/front-end/static/orderSub/images/superCharge.png' : item.chargeType == 'man' ? 'https://oos-cn.ctyunapi.cn/front-end/static/orderSub/images/slowCharge.png' : 'https://oos-cn.ctyunapi.cn/front-end/static/orderSub/images/fastCharge.png'"
                                class="charge-type"
                        ></image> -->
					</view>

					<view class="order-list-bottom">
						<!-- <view class="order-list-bottom-left">
                            <text class="order-type">充电订单</text>
                            <text class="account-type" :style="'color:' + (item.memberType == 1 ? 'orange' : item.memberType == 2 ? 'orange' : 'green') + ';'">
                                {{ item.memberType == 1 ? '个人账号' : item.memberType == 2 ? '车队账号' : '微信支付积分' }}
                            </text>
                        </view> -->
						<!-- wx:if="{{item.operatingState}}" -->
						<view v-if="item.type == 3" class="operate-state2" @tap.stop.prevent="orderTop"
							:data-index="item">
							评价
						</view>
						<view v-if="item.type == 2||item.type == 3||item.type ==1||item.type ==5" class="operate-state"
							@tap.stop.prevent="operation" :data-index="item"
							:style="item.type==1?'border: 1rpx solid #606266;color: #606266;':'color:' + (objColor2.textColor) + ';border: 1rpx solid ' + (objColor2.textColor) + ';'">
							{{ item.type == 2 ? '立即支付' : (item.type == 1 && item.isCharging)?'充电详情' : (!item.isCharging && (item.billStatus == 4 || item.billStatus == 6)) ? '关闭订单':'再次充电' }}

						</view>
					</view>
				</view>
			</view>
			<view v-if="orderList.length<=0&&showOrderList">
				<upgrading text="暂无数据"></upgrading>
				<view class="chargingButton" @tap="goChargin">去充电</view>
			</view>
		</view>


		<view v-if="loadAll" class="noList">{{ tips }}</view>
		<!-- 筛选弹窗 -->
		<view>
			<uni-popup ref="showOrderScreen" safe-area type="bottom" class="coupons2-popup">
				<view class="filtrate">
					<!-- <view>
						<text class="order-label">订单列表</text>
						<view class="order-type-list">
							<view :data-index="index"
								:class="'order-type-item ' + (orderTypeIndex == index ? 'activite' : '')"
								@tap="getTypeIndex" v-for="(item, index) in orderTypeList" :key="index">
								<view class="order-type">{{ item.name }}</view>
							</view>
						</view>
					</view> -->
					<!-- 个人身份才展示 -->
					<view v-if="!memberType">
						<text class="payment-label">支付方式</text>
						<view class="payment-list">
							<view :data-index="index"
								:class="'payment-list-item ' + (paymentIndex == index ? 'activite' : '')"
								@tap="getPaymentIndex" v-for="(item, index) in paymentList" :key="index">
								<view class="payment-list-type">{{ item.name }}</view>
							</view>
						</view>
					</view>
					<view>
						<text class="start-time-label">充电时间</text>
						<view class="date-select">
							<view class="start-date-select">
								<image src="https://oos-cn.ctyunapi.cn/front-end/static/orderSub/images/date.png"
									class="dateIcon">
								</image>
								<!-- <input
                                    type="text"
                                    class="date-input"
                                    placeholder="开始时间"
                                    :value="startTime"
                                    data-range="start"
                                    placeholder-class="date-input-placeholder"
                                    @tap="goStatTimeSearch"
                                    :disabled="true"
                                /> -->
								<picker mode="date" header-text="开始时间" :value="startTime" @change="bindStarTimeChange">
									<view class="date-input">{{ startTime }}</view>
								</picker>
							</view>

							<view class="date-divide">至</view>
							<view class="end-date-select">
								<image src="https://oos-cn.ctyunapi.cn/front-end/static/orderSub/images/date.png"
									class="dateIcon">
								</image>
								<!-- <input
                                    type="text"
                                    class="date-input"
                                    placeholder="结束时间"
                                    data-range="end"
                                    placeholder-class="date-input-placeholder"
                                    :value="endTime"
                                    @tap="goEndTimeSearch"
                                    :disabled="true"
                                /> -->
								<picker mode="date" header-text="结束时间" :value="endTime" @change="bindEndTimeChange">
									<view class="date-input">{{ endTime }}</view>
								</picker>
							</view>
						</view>
					</view>
					<!-- <view class="datetimePicker">
                        <datetimePicker v-model="range" type="daterange" rangeSeparator="至"  :border="false"/>
                    </view> -->
					<view class="filtrate-bottom">
						<view class="filtrate-cancel" @tap="onClose">取消</view>
						<view class="filtrate-confirm" @tap="onDetermine">确定</view>
					</view>
				</view>
			</uni-popup>
		</view>
		<!-- 时间选择 :show="timeStatus"-->
		<view>
			<uni-popup ref="showOrderDate" safe-area type="bottom" class="coupons2-popup">
				<uni-datetime-picker type="date" :value="currentDate" @input="onInput" @confirm="dateConfirm"
					@cancel="dateCancel" :formatter="formatter" :max-date="maxDate" :min-date="minDate" />
			</uni-popup>
		</view>

		<uni-popup ref="showBulletFrame" safe-area type="center">
			<view class="BulletFrameCon">
				<view class="bulletTitle">
					待结算订单说明
				</view>
				<view class="bulletVal">
					部分充电桩因为网络信号弱或者服务连接中断，会存在部分订单结束充电请求延误情况，导致账单无法及时生成。当您存在待结算订单时，为保障顺利完成支付，系统将临时冻结您启动充电预付部分金额，待充电桩网络恢复上传订单数据后，订单自动完成结算，并解冻剩余金额。如有疑问可联系客服。
				</view>
				<view class="bulletButton" @tap="showFrame">
					了解
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	'use strict';
	import tabs from '../../../orderSub/components/tabs2/tabs2';
import upgrading from '../../../components/upgrading/upgrading';
import adModule from '@/components/adModule/adModule';

	//import datetimePicker from '@/components/datetime-picker/components/datetime-picker/datetime-picker.vue';
	import {
	getMyOccupyBillPage
} from '@/api/placeholder.js';
import {
	stopAndCloseCharge
} from '@/api/orderMsgApi';
	var __assign =
		(this && this.__assign) ||
		function() {
			__assign =
				Object.assign ||
				function(t) {
					for (var s, i = 1, n = arguments.length; i < n; i++) {
						s = arguments[i];

						for (var p in s) {
							if (Object.prototype.hasOwnProperty.call(s, p)) {
								t[p] = s[p];
							}
						}
					}

					return t;
				};

			return __assign.apply(this, arguments);
		};

	// exports.__esModule = true; // orderSub/pages/order/order.ts

	var app = getApp();

	var util_1 = require('./../../../utils/util.js');

	var https_1 = require('./../../../api/https.js');
	var myData = new Date();
	export default {
		components: {
			tabs,
			upgrading,
			adModule
			//datetimePicker
		},
		data() {
			return {
				marketingSwitch: app.globalData.marketingSwitch,
				sellerNo: app.globalData.sellerNo,
				// 占位订单
				placeholderOrderCount: 0,
				maxDate: new Date().getTime(),
				minDate: new Date(new Date().setFullYear(new Date().getFullYear() - 1)).getTime(),

				formatter: function(type, value) {
					if (type === 'year') {
						return value + '\u5E74';
					}

					if (type === 'month') {
						return value + '\u6708';
					}

					return value;
				},

				loadAll: true,
				showOrderList: false, // 加载时隐藏暂无数据
				page: 1,

				// 订单状态  
				//val值对应状态:  1 = 充电中  2 = 待支付  3 = 已完成 5 = 账单结算中  其它 = 已关闭
				// state对应值： 1:鉴权成功 2：启动中 3:启动失败 4:充电中 5：充电完成 6:待入库 7:入库失败 8:入库成功 9：费用计算中
				//  10:计费成功 11.待支付 12:支付失败   13:部分支付 14:已结清 15:坏账 16:手动关闭 17:已冲销 18:已退款
				orderStatus: [{
						state: '1',
						val: 1
					},
					{
						state: '2',
						val: 1
					},
					{
						state: '3',
						val: 3
					},
					{
						state: '4',
						val: 1
					},
					{
						state: '5',
						val: 5
					},
					{
						state: '6',
						val: 5
					},
					{
						state: '7',
						val: 5
					},
					{
						state: '8',
						val: 5
					},
					{
						state: '9',
						val: 5
					},
					{
						state: '10',
						val: 2
					},
					{
						state: '11',
						val: 2
					},
					{
						state: '12',
						val: 2
					},
					{
						state: '13',
						val: 2
					},
					{
						state: '14',
						val: 3
					},
					{
						state: '15',
						val: 2
					},
					{
						state: '16',
						val: 4
					},
					{
						state: '17',
						val: 3
					},
					{
						state: '18',
						val: 4
					}
				],

				// ['全部订单','进行中','待支付']
				tabMenu: [{
						name: '全部订单'
					},
					{
						name: '充电中',
						value: 0
					},
					{
						name: '待结算'
					},
					{
						name: '待支付'
					}
				],

				orderList: [],
				blue: '#4096EC',
				green: '#606266',
				orange: '#FC724C',
				gray: '#909399',
				bgGreen: 'rgba(123, 204, 69, 0.06)',
				tabsBg: '#F5F7FA',

				orderTypeList: [{
						name: '全部订单'
					},
					{
						name: '充电中'
					},
					{
						name: '待结算'
					},
					{
						name: '待支付'
					}
				],

				paymentList: [{
						name: '全部',
						value: 0,
					},
					{
						name: '个人账户',
						value: 1,
					},
					// {
					// 	name: '车队账户',
					// 	value:2,
					// },
					{
						name: '充完即退',
						value: -1,
					},
					{
						name: '微信支付分',
						value: -2,
					}
				],
				memberType: 0,

				orderTypeIndex: 0,
				paymentIndex: 0,
				screeningStatus: false,
				minHour: 10,
				maxHour: 20,
				currentDate: myData.getTime(),
				timeStatus: false,
				startTime: '开始时间',
				endTime: '结束时间',
				currentTimeStatus: 'start',
				maxMinute: 0,

				queryParam: {
					current: 1,
					size: 10
				},

				searchtxt: '',

				guns: [{
						value: 0,
						name: 'A'
					},
					{
						value: 1,
						name: 'B'
					},
					{
						value: 2,
						name: 'C'
					},
					{
						value: 3,
						name: 'D'
					},
					{
						value: 4,
						name: 'E'
					},
					{
						value: 5,
						name: 'F'
					},
					{
						value: 6,
						name: 'G'
					},
					{
						value: 7,
						name: 'H'
					},
					{
						value: 8,
						name: 'I'
					},
					{
						value: 9,
						name: 'J'
					},
					{
						value: 10,
						name: 'K'
					},
					{
						value: 11,
						name: 'L'
					},
					{
						value: 12,
						name: 'M'
					},
					{
						value: 13,
						name: 'N'
					},
					{
						value: 14,
						name: 'O'
					},
					{
						value: 15,
						name: 'P'
					},
					{
						value: 16,
						name: 'Q'
					},
					{
						value: 17,
						name: 'R'
					},
					{
						value: 18,
						name: 'S'
					},
					{
						value: 19,
						name: 'T'
					},
					{
						value: 20,
						name: 'U'
					},
					{
						value: 21,
						name: 'V'
					},
					{
						value: 22,
						name: 'W'
					},
					{
						value: 23,
						name: 'X'
					},
					{
						value: 24,
						name: 'Y'
					},
					{
						value: 25,
						name: 'Z'
					}
				],

				tips: '',

				range: [],
				adIdList:['WX_APPLET_ElPP'],
			};
		},
		onShow() {
			if (!uni.getStorageSync('token')) {
				uni.showModal({
					title: '您还没登录',
					content: '请先登录再进行操作',
					cancelText: '暂不登录',
					confirmText: '立即登录',
					success: function(res) {
						if (res.confirm) {
							console.log('用户点击确认')
							uni.navigateTo({
								url: `/packagePersonal/pages/login/login?qrCodeUrl=${encodeURIComponent('/orderSub/pages/order/order')}`
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			} else {
				this.orderList = [],
					this.loadAll = false,
					this.queryParam = {
						current: 1,
						size: 10
					}
				this.getMyOccupyBillPage()
				this.getBillPage(true);
			}


		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			this.memberType = uni.getStorageSync('memberType')
			if (options.searchtxt) {
				this.setData({
					searchtxt: options.searchtxt,
					orderTypeIndex: 0
				});
			}

			if (options.orderTypeIndex) {
				this.setData({
					orderTypeIndex: options.orderTypeIndex
				});
			}

			// this.getBillPage(true);

			// this.getUnpaid()
		},

		// 页面上拉触底事件的处理函数
		onReachBottom: function() {
			if (this.queryParam.current == this.page) {
				// 到底
				this.setData({
					loadAll: true,
					tips: '已加载全部订单！'
				});
			} else {

				this.queryParam = {
					current: ++this.queryParam.current,
					size: 10
				}

				this.getBillPage();
			}
		},
		methods: {
			getMyOccupyBillPage() {
				getMyOccupyBillPage({
					current: 1,
					pageSize: 10
				}).then(res => {
					this.placeholderOrderCount = res.data.total
				})
			},
			BulletFrame() {
				this.$refs.showBulletFrame.open()
			},
			showFrame: function() {
				this.$refs.showBulletFrame.close()
			},
			getOrderDescription() {
				this.$refs.showBulletFrame.open()
				// uni.showModal({
				// 	title: '待结算订单说明',
				// 	content: '部分充电桩因为网络信息弱或者服务连接中断，会存在部分订单结束充电请求延误情况，导致账单无法及时生成。当您存在待结算订单时，为保障顺利完成支付，系统将临时冻结您启动充电预付部分金额，待充电桩网络恢复上传订单数据后，订单自动完成结算，并解冻剩余金额。如有疑问可联系客服。',
				// 	confirmText: '了解',
				// 	showCancel: false,
				// });
			},
			toPlaceholderOrder() {
				uni.navigateTo({
					url: '/orderSub/pages/placeholderOrder/placeholderOrder'
				})
			},
			bindStarTimeChange: function(e) {

				this.startTime = e.detail.value


				// .replace('-', '年')+'月'
			},
			bindEndTimeChange: function(e) {
				this.endTime = e.detail.value
			},
			// 跳转到站点详情
			goSite: function(e) {
				// console.log('e', e.currentTarget.dataset.index)
				let item = e.currentTarget.dataset.index
				if (item.terminalType == 2) {
					uni.navigateTo({
						url: '/homeSub/pages/eBikeSiteDetail/eBikeSiteDetail?stationId=' + item.stationId
					});
				} else {
					uni.navigateTo({
						url: '/homeSub/pages/siteDetail/siteDetail?stationId=' + e.currentTarget.dataset.index
							.stationId
					});
				}

			},

			// 获取未支付订单数
			getUnpaid() {
				let operaeForm = {
					startTime: null,
					endTime: null,
					memberType: null,
					billStatusList: [4],
					searchBarCondition: '',
					current: 1,
					size: 9999,
					version: 1,
					disCharge: false, // 是否是放电
				}
				let th = this
				https_1.myBillPage(operaeForm).then(function(res) {
					if (res.code == 0) {
						let number = res.data.records.length
						th.tabMenu[1].value = number

					}
				})
			},

			// 获取订单列表
			getBillPage: function(flag) {
				var that = this;
				console.log(uni.getStorageSync('memberType'))
				let memberType = uni.getStorageSync('memberType').toString()

				var payType = this.paymentList[this.paymentIndex].value

				var operaeForm = __assign({
						startTime: this.startTime != '开始时间' ? new Date(this.startTime).toISOString() : null,
						endTime: this.endTime != '结束时间' ? new Date(new Date(this.endTime).getTime() + 24 * 60 *
							60 * 1000 - 1).toISOString() : null,
						memberType: payType || null,
						billStatusList: this.orderTypeIndex == 0 ? null : this.orderTypeIndex == 1 ? [4] : this
							.orderTypeIndex == 3 ? [11, 12, 13] : this.orderTypeIndex == 2 ? [5, 6, 7, 8, 9] : [],
						searchBarCondition: this.searchtxt,
						version: 1,
						disCharge: false, // 是否是放电
					},
					this.queryParam
				);
				console.log(operaeForm, '入参')
				this.setData({
					showOrderList: false
				})
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				https_1.myBillPage(operaeForm).then(function(res) {
					uni.hideLoading();

					if (res.code == 0) {
						var list_1 = that.orderList;
						var number_1 = 0;
						res.data.records.map(function(item, index) {
							item.type = that.judgmentState(item.billStatus);
							item.startTime = item.timeS.substring(0, item.timeS.lastIndexOf(':'));

							if (item.timeE) {
								item.endTime = item.timeE.substring(0, item.timeS.lastIndexOf(':'));
							} else {
								item.endTime = null;
							}

							item.actualBalance = that.regFenToYuan(item.actualBalance);

							// 实付金额计算  实付金额=订单总金额-优惠金额-奖励金
							item.busBalance = that.regFenToYuan(item.busBalance)

							item.totalDiscountBalance = that.regFenToYuan(item.totalDiscountBalance)
							item.deductibleBalance = that.regFenToYuan(item.deductibleBalance)
							// console.log(
							// 	`列表第${index+1 }条数据的订单总金额是${item.busBalance},优惠总金额是${item.totalDiscountBalance}抵扣总金额是${item.deductibleBalance}后端返回的paylog是${item.paylog}`
							// )
							// console.log('actualBalance', item.actualBalance)
							// console.log('billPayLog', item.billPayLog)
							item.actualBalanceCalculate = item.actualBalance
							// item.actualBalanceCalculate = (item.busBalance - (item.totalDiscountBalance || 0) - (item.deductibleBalance || 0)).toFixed(2)

							if (!item.gunName) {
								item.gunName = that.guns[Number(item.gunNumber)].name;
							}

							list_1.push(item);

							if (item.type == 1) {
								++number_1;
							}


						});

						that.orderList = list_1
						that.page = res.data.pages
						that.showOrderList = true

					}
				});
			},

			onDetermine: function() {
				this.orderList = [],
					this.queryParam = {
						current: 1,
						size: 10
					}
				this.getBillPage();
				this.$refs.showOrderScreen.close()

				this.screeningStatus = false

			},

			checkIndex: function(e) {
				var detail = e.detail;
				this.orderTypeIndex = detail,
					this.orderList = [],
					this.loadAll = false,
					this.queryParam = {
						current: 1,
						size: 10
					}

				this.getBillPage();
			},

			// 订单类型选择
			getTypeIndex: function(e) {
				var index = e.currentTarget.dataset.index;
				// 存一下旧的订单状态，取消的时候使用
				this.orderTypeIndex_old = this.orderTypeIndex

				this.orderTypeIndex = index
			},

			// 判断订单状态
			judgmentState: function(e) {
				var type = '';
				this.orderStatus.map(function(item) {
					if (e == item.state) {
						type = item.val;
					}
				});
				return type;
			},

			// 订单操作
			operation: function(e) {
				console.log('e', e)
				var order = e.currentTarget.dataset.index;
				var that = this
				console.log(e.currentTarget.dataset.index, 'lslslsls')
				if (e.currentTarget.dataset.index.type == 3 || e.currentTarget.dataset.index.type == 5) {
					// wx.navigateTo({
					//   url:'/homeSub/pages/terminal/pileDetail/pileDetail?pileNo='+e.currentTarget.dataset.index.pileNum
					// })
					if (order.terminalType == 2) {
						uni.navigateTo({
							url: '/homeSub/pages/eBikeSiteDetail/eBikeSiteDetail?stationId=' + order.stationId
						});
					} else {
						// 待入库6情况，显示关闭订单 
						if (order.billStatus == 6) {
							this.closeOrder(order.busId)
						} else {
							uni.navigateTo({
								url: '/homeSub/pages/siteDetail/siteDetail?stationId=' + e.currentTarget
									.dataset.index.stationId
							});
						}

					}

				} else if (e.currentTarget.dataset.index.type == 1) {
					// 实时数据非充电中并且订单状态为充电中 显示关闭订单
					if (!order.isCharging && order.billStatus == 4) {
						this.closeOrder(order.busId)
					} else {
						uni.navigateTo({
							url: '/echartsPages/pages/power/power?busId=' + order.busId + '&pileNo=' + order
								.pileNum + '&gunNo=' + order.gunNumber + '&stationId=' + order.stationId + '&billStatus=' + order.billStatus
						});
					}

				} else if ((e.currentTarget.dataset.index.billStatus == 13 || e.currentTarget.dataset.index
						.billStatus == 12) && e.currentTarget.dataset.index.disposableOrder) {
					if (!that.marketingSwitch) {
						uni.navigateTo({
							url: '../orderDetails/orderDetails?orderId=' + e.currentTarget.dataset.index.id +
								'&type=' + e
								.currentTarget.dataset.index.type
						});
					} else {
						uni.navigateTo({
							url: '../orderDetailsYxhk/orderDetailsYxhk?orderId=' + e.currentTarget.dataset
								.index.id + '&type=' +
								e.currentTarget.dataset.index.type
						});
					}
					// uni.navigateTo({
					// 	url: '../orderDetails/orderDetails?orderId=' + e.currentTarget.dataset.index.id +
					// 		'&type=' + e.currentTarget.dataset.index.type
					// });
					return false
				} else if (e.currentTarget.dataset.index.billStatus == 11 && e.currentTarget.dataset.index
					.disposableOrder) {
					if (!that.marketingSwitch) {
						uni.navigateTo({
							url: '../orderSettlement/orderSettlement?busId=' + order.busId
						});
					} else {
						uni.navigateTo({
							url: '../orderSettlementYxhk/orderSettlement?busId=' + order.busId
						});
					}
					// uni.navigateTo({
					// 	url: '../orderSettlement/orderSettlement?busId=' + order.busId
					// });
					return false
				} else if (e.currentTarget.dataset.index.type == 2) {
					// uni.navigateTo({
					// 	url: '../orderSettlement/orderSettlement?busId=' + order.busId
					// });
					if (!that.marketingSwitch) {
						uni.navigateTo({
							url: '../orderSettlement/orderSettlement?busId=' + order.busId
						});
					} else {
						uni.navigateTo({
							url: '../orderSettlementYxhk/orderSettlement?busId=' + order.busId
						});
					}
				}
			},
			// 关闭订单
			closeOrder(busId) {
				// let order = e.currentTarget.dataset.index
				let _this = this
				uni.showModal({
					title: '消息提示',
					content: '当前检测未启动成功您确认停止充电吗？',
					confirmText: '确认',
					cancelText: '取消',
					success: function(res) {
						if (res.confirm) {
							stopAndCloseCharge({
								busId: busId
							}).then((res) => {
								console.log('res', res)
								if (res.code == 0) {
									// 接口查询es数据问题，后端要求延时1s后刷新数据
									setTimeout(() => {
										_this.orderList = [],
											_this.queryParam = {
												current: 1,
												size: 10
											}
										_this.getBillPage()
									}, 1000)

								} else if (res.code == 3) {
									uni.showToast({
										title: res.msg,
										icon: 'none'
									});
								}
							})

						}
					}
				})
			},

			//去评论
			orderTop: function(e) {
				console.log(e, "去评论....");
				uni.navigateTo({
					url: `../orderMsg/orderMsg?busId=${e.currentTarget.dataset.index.busId}&id=${e.currentTarget.dataset.index.id}&commentstatus=${e.currentTarget.dataset.index.commentstatus}`,
				});
			},

			// 分转元
			regFenToYuan: function(fen) {
				var num = fen;
				num = fen * 0.01;
				num += '';
				var reg = num.indexOf('.') > -1 ? /(\d{1,3})(?=(?:\d{3})+\.)/g : /(\d{1,3})(?=(?:\d{3})+$)/g;
				num = num.replace(reg, '$1'); // num = toDecimal2(num)

				return Number(num).toFixed(2);
			},

			// 跳转到首页
			goChargin: function() {
				uni.switchTab({
					url: '/pages/index/index'
				});
			},

			// 搜索
			goSearch: function() {
				// app.globalData.CHECK_LOGIN(function () {
				uni.navigateTo({
					url: '../../pages/search/search'
				});
				// });
			},

			// 支付方式选择
			getPaymentIndex: function(e) {
				var index = e.currentTarget.dataset.index;
				// 存旧的支付方式取消时候调用
				this.paymentIndex_old = this.paymentIndex
				this.paymentIndex = index
			},

			screening: function() {
				this.$refs.showOrderScreen.open()
			},

			onClose: function() {
				// 取消使用旧的类型
				this.paymentIndex = this.paymentIndex_old
				this.orderTypeIndex = this.orderTypeIndex_old

				this.$refs.showOrderScreen.close()
			},

			onInput: function(e) {

				this.currentDate = e.detail

			},

			// 充电开始结束数据选择
			dateConfirm: function(e) {
				var detail = e.detail;

				if (this.currentTimeStatus == 'start') {
					this.startTime = util_1.formatYMD(new Date(detail)),
						this.timeStatus = false

				} else {
					this.endTime = util_1.formatYMD(new Date(detail)),
						this.timeStatus = false

				}
			},

			dateCancel: function() {

				this.timeStatus = false

			},

			goStatTimeSearch: function(e) {
				console.log('进入')
				this.$refs.showOrderDate.close()
				var range = e.currentTarget.dataset.range;
				this.timeStatus = true,
					this.currentTimeStatus = range

			},

			goEndTimeSearch: function(e) {
				var range = e.currentTarget.dataset.range;

				this.timeStatus = true,
					this.currentTimeStatus = range

			},

			goDetails: function(e) {
				var that = this
				console.log(e.currentTarget.dataset, '34')
				if (e.currentTarget.dataset.index.type == 1) {
					// 进行中，跳转到充电中页面
					var order = e.currentTarget.dataset.index;
					uni.navigateTo({
						url: '/echartsPages/pages/power/power?busId=' + order.busId + '&pileNo=' + order
							.pileNum + '&gunNo=' + order.gunNumber + '&stationId=' + e.currentTarget.dataset
							.index.stationId + '&billStatus=' + order.billStatus
					});
				} else if (e.currentTarget.dataset.index.type == 5) {
					uni.navigateTo({
						url: '../orderInSettlement/orderInSettlement?orderId=' + e.currentTarget.dataset.index
							.id + '&stationId=' + e.currentTarget.dataset.index.stationId
					});
				} //待支付
				else if (e.currentTarget.dataset.index.type == 2) {
					if (!that.marketingSwitch) {
						uni.navigateTo({
							url: '../orderSettlement/orderSettlement?busId=' + e.currentTarget.dataset.index
								.busId +
								'&stationId=' + e.currentTarget.dataset.index.stationId
						});
					} else {
						uni.navigateTo({
							url: '../orderSettlementYxhk/orderSettlement?busId=' + e.currentTarget.dataset
								.index.busId +
								'&stationId=' + e.currentTarget.dataset.index.stationId
						});
					}
				} else {
					if (!that.marketingSwitch) {
						uni.navigateTo({
							url: '../orderDetails/orderDetails?orderId=' + e.currentTarget.dataset.index.id +
								'&type=' + e
								.currentTarget.dataset.index.type + '&stationId=' + e.currentTarget.dataset
								.index.stationId
						});
					} else {
						uni.navigateTo({
							url: '../orderDetailsYxhk/orderDetailsYxhk?orderId=' + e.currentTarget.dataset
								.index.id + '&type=' +
								e.currentTarget.dataset.index.type + '&stationId=' + e.currentTarget.dataset
								.index.stationId
						});
					}
				}
			}
		}
	};
</script>
<style lang="less" scoped>
	/* orderSub/pages/order/order.wxss */
	@import "../../../commin/commin.less";

	.BulletFrameCon {
		width: 702rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		font-family: PingFang SC;
		overflow: hidden;

		.bulletTitle {
			padding: 45rpx 0rpx 40rpx 0rpx;
			text-align: center;
			font-size: 34rpx;
			font-weight: bold;
			color: #303133;
		}

		.bulletVal {
			font-size: 30rpx;
			font-weight: 500;
			color: #303133;
			line-height: 45rpx;
			padding: 0 35rpx;
		}

		.bulletButton {
			margin-top: 86rpx;
			text-align: center;
			border-top: 1rpx solid #DCDFE6;
			padding: 40rpx 0;
			font-weight: bold;
			color: var(--textColor);
			font-size: 30rpx;
		}
	}

	.order-header {
		// position:fixed;
		// top: 0;
		z-index: 99;
		background-color: #fff;

		.search {
			// position: fixed;
			// top: 0;
			display: flex;
			align-items: center;
			background-color: @white-color;

			.weui-search-bar {
				.paddings(18rpx, 28rpx, 24rpx, 24rpx);
				display: flex;
			}

			.weui-icon-search {
				margin-right: 8px;
				font-size: inherit;
			}

			.weui-icon-search_in-box {
				position: absolute;
				left: 10rpx;
				top: 12rpx;
			}

			.weui-search-bar__text {
				display: inline-block;
				font-size: 14px;
				vertical-align: middle;
			}

			.weui-search-bar__form {
				flex: auto;
				background-color: @text-color6;
				border-radius: 35rpx;
				.paddings(10rpx, 10rpx, 10rpx, 33rpx);
			}

			.weui-search-bar__box {
				position: relative;
				padding-left: 30px;
				padding-right: 30px;
				width: 100%;
				box-sizing: border-box;
				z-index: 1;
			}

			.weui-search-bar__input {
				height: 28px;
				line-height: 28px;
				font-size: 14px;
				background-color: @text-color6;
				width: 100%;
			}

			.weui-icon-clear {
				position: absolute;
				top: 0;
				right: 0;
				padding: 7px 8px;
				font-size: 0;
			}

			.weui-search-bar__label {
				position: absolute;
				top: 0;
				right: 0;
				bottom: 0;
				left: 0;
				z-index: 2;
				border-radius: 3rpx;
				text-align: center;
				color: #9B9B9B;
				background: #FFFFFF;
				line-height: 28px;
			}

			.weui-search-bar__cancel-btn {
				margin-left: 10px;
				line-height: 28px;
				color: #09BB07;
				white-space: nowrap;
				font-size: 30rpx;
			}

			.screening {
				.kuangao(40rpx, 40rpx);
			}
		}
	}

	.order-list {
		.order-list-item {
			.margins(auto, 24rpx, auto, 24rpx);
			background: linear-gradient(0deg, #FFFFFF, #F4F6F8);
			.borders(2rpx, @white-color);
			box-shadow: 4rpx 7rpx 20rpx 0rpx rgba(166, 171, 179, 0.24);
			border-radius: 16rpx;
			margin-bottom: 16rpx;
			.paddings(39rpx, 24rpx, 33rpx, 24rpx);

			.order-list-top {
				display: flex;
				justify-content: space-between;
				align-items: center;
				.margins(auto, 8rpx, 0rpx, 8rpx);

				//padding-bottom: 24rpx;
				//  border-bottom: 1rpx solid @text-color5;
				.siteName {
					.fontsize(34rpx);
					.kuan(340rpx);
					.yiman(1);
					font-family: PingFang SC;
					font-weight: bold;
					color: @text-color2;
				}

				.status {
					.fontsize(28rpx);
					font-family: PingFang SC;
					font-weight: 500;
					color: @blue;
					display: flex;
					align-items: center;
				}
			}

			.order-list-center {
				position: relative;
				.margins(auto, 5rpx, auto, 5rpx);

				.order-list-center-left {
					display: flex;
					justify-content: start;
					align-items: center;

					.order-img {
						width: 160rpx;
						height: 160rpx;
						.margins(auto, 30rpx, auto, 9rpx);
					}

					.gun-number {
						.fontsize(30rpx);
						font-family: PingFang SC;
						font-weight: bold;
						color: @text-color2;
					}

					.degree {
						.fontsize(34rpx);
						font-family: DINAlternate;
						font-weight: bold;
						.margins(23rpx, auto, 20rpx, auto);
						color: @orange;

						text:nth-child(1) {
							.fontsize(24rpx);
							font-family: PingFang SC;
							font-weight: 500;
							color: #FF5A3A;
						}

						text:nth-child(2) {
							.fontsize(40rpx);
							font-family: PingFang SC;
							font-weight: bold;
							color: #FF5A3A;
						}
					}

					.period-time {
						.fontsize(24rpx);
						font-family: PingFang SC;
						font-weight: 400;
						color: @text-color3;
						margin-top: 26rpx
					}

					.period-time2 {
						.fontsize(28rpx);
						font-family: PingFang SC;
						font-weight: 400;
						color: #909399;
						margin-top: 26rpx
					}

					.period-text {
						font-weight: 500;
						color: #303133;
					}
				}

				.charge-type {
					.kuangao(77rpx, 40rpx);
					position: absolute;
					top: 0rpx;
					right: 0rpx;
				}
			}

			.order-list-bottom {
				// display: flex;
				// justify-content: space-between;
				// align-items: center;
				.margins(0rpx, 12rpx, auto, 12rpx);
				text-align: right;

				.order-list-bottom-left {
					.fontsize(24rpx);
					font-family: PingFang SC;
					font-weight: 500;

					.order-type {
						.paddings(8rpx, 19rpx, 8rpx, 19rpx);
						color: @blue;
						background: rgba(20, 135, 250, 0.06);
						border-radius: 4rpx;
					}

					.account-type {
						.paddings(8rpx, 19rpx, 8rpx, 19rpx);
						margin-left: 14rpx;
						background: rgba(252, 114, 76, 0.06);
						color: @orange;
						border-radius: 4rpx;
					}
				}

				.operate-state {
					.kuangao(164rpx, 64rpx);
					line-height: 64rpx;
					.textalign();
					.borders(1rpx, @blue);
					border-radius: 32rpx;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: @blue;
					display: inline-block;
					margin-left: 16rpx
				}

				.operate-state2 {
					.kuangao(164rpx, 64rpx);
					line-height: 64rpx;
					.textalign();
					.borders(1rpx, #606266);
					border-radius: 32rpx;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #606266;
					display: inline-block;
				}
			}
		}
	}

	.filtrate {
		background-color: #ffffff;
		.paddings(39rpx, 31rpx, 34rpx, 31rpx);

		.order-label,
		.payment-label,
		.start-time-label {
			.fontsize(34rpx);
			font-family: PingFang SC;
			font-weight: bold;
			color: @text-color2;
		}

		.order-type-list,
		.payment-list {
			display: grid;
			justify-content: flex-start;
			grid-template-columns: repeat(auto-fill, 170rpx);
			grid-gap: 0 24rpx;
			padding: 20rpx auto 36rpx -25rpx;

			.order-type-item,
			.payment-list-item {
				.kuangao(170rpx, 64rpx);
				// height:64rpx;
				.fontsize(28rpx);
				.borders(1rpx, @text-color6);
				.textalign();
				.margins(12rpx, auto, 12rpx, auto);
				line-height: 64rpx;
				color: @text-color3;
				background: @text-color6;
				border-radius: 32rpx;
				font-family: PingFang SC;
				font-weight: 500;
			}

			.activite {
				.kuangao(170rpx, 64rpx);
				.borders(1rpx, var(--textColor));
				.fontsize(28rpx);
				.textalign();
				.margins(12rpx, auto, 12rpx, auto);
				line-height: 64rpx;
				color: var(--textColor);
				border-radius: 32rpx;
				background: rgba(20, 135, 250, 0.06);
				font-family: PingFang SC;
				font-weight: 500;
			}
		}

		.date-select {
			display: flex;
			justify-content: start;
			align-items: center;
			margin-top: 32rpx;

			.start-date-select,
			.end-date-select {
				position: relative;
				.kuangao(295rpx, 64rpx);
				.paddings(0rpx, 30rpx, 0rpx, 82rpx);
				background: @text-color6;
				border-radius: 32px;
				box-sizing: border-box;
				z-index: 1;

				.dateIcon {
					position: absolute;
					width: 26rpx;
					height: 26rpx;
					top: 50%;
					left: 32rpx;
					transform: translate(0, -50%);
				}

				.date-input {
					height: 64rpx;
					line-height: 64rpx;
					.fontsize(22rpx);
					font-family: PingFang SC;
					font-weight: 400;
					color: @text-color2;
				}

				.date-input-placeholder {
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #909399;
				}
			}

			.date-divide {
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: @text-color3;
				.margins(auto, 25rpx, auto, 25rpx);
			}
		}

		.filtrate-bottom {
			display: flex;
			justify-content: center;
			align-items: center;
			margin-top: 83rpx;

			.filtrate-cancel,
			.filtrate-confirm {
				.kuangao(270rpx, 88rpx);
				.fontsize(30rpx);
				.textalign();
				border-radius: 44rpx;
				line-height: 88rpx;
				font-family: PingFang SC;
				font-weight: bold;
			}

			.filtrate-cancel {
				.borders(1rpx, @text-color4);
				color: @text-color4;
				margin-right: 12rpx;
			}

			.filtrate-confirm {
				background: linear-gradient(105deg, var(--btnColor), var(--btnColor));
				box-shadow: 0rpx 3rpx 6rpx 0rpx rgba(0, 110, 212, 0.3);
				color: @white-color;
				margin-left: 12rpx;
			}
		}


	}

	.noList {
		text-align: center;
		font-size: 24rpx;
		color: #9699A6;
	}

	.chargingButton {
		text-align: center;
		position: relative;
		// top: -80rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: var(--textColor);
		margin-top: 40rpx;
	}

	.datetimePicker {
		.fontsize(28rpx);
		.borders(1rpx, @text-color6);
		.textalign();
		.margins(12rpx, auto, 12rpx, auto);
		color: @text-color3;
		background: #F5F7FA;
		border-radius: 32rpx;
		font-family: PingFang SC;
		font-weight: 500;

		.uni-date-range {
			background: none;
		}
	}

	.ToBeSettled {
		background: #FC724C;
		height: 64rpx;
		line-height: 64rpx;
		color: #fff;
		font-weight: 400;
		font-size: 24rpx;
		padding-left: 33rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.settlementImg {
		width: 25rpx;
		height: 25rpx;
		margin-right: 29rpx;
	}

	.settlementImg2 {
		width: 13rpx;
		height: 25rpx;
		margin-left: 29rpx;
		vertical-align: middle;
	}
	.right-icon {
		line-height: 1;
		margin-left: 4rpx;
	}
</style>